<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="./css/apilndex.css">
</head>

<body>
    <header class="clearfix plr30 rel">
        <!--    logo 
            制作方式有很多种，常见以下
            1.使用img
            2.使用a标签包一个img
            3.使用a标签包h1标签，img或者h制作背景 -->
        <img src="imgs/new-logo-white2.png" class=" logo fl mt18">

        <!--  菜单  -->

        <ul class=" menu abs smenu">
            <li><a href=" #">首页</a></li>
            <li class="active"><a href="#">API</a></li>
            <li><a href="#">云服务</a></li>
            <li><a href="#">案例</a></li>
            <li><a href="#">开发者</a></li>
        </ul>
        <!-- 登录和注册 -->
        <div class="fr mt18 right right-box f12">
            <a href="#" class="p515 c6">登录</a>
            <a href="#" class="p515 ml10">注册有礼</a>
        </div>
    </header>
    <main class="container">

        <!-- 分类 -->
        <div class="category mt20">
            <h2 class="f24 c3d">API分类</h2>
            <ul class="clearfix c6 cateList">
                <!--    <li class="active">全部</li> -->
                <!--     <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>
                <li>生活服务</li>  -->
            </ul>
        </div>


        <!-- 搜索框 -->
        <div class="search clearfix">
            <span class="fl bold" id="txt">全部</span>
            <div class="search-box fl">
                <input type=" text" class="fl" placeholder="身份证实名" id="keyword">
                <input type="button" class="fl btn">
            </div>
        </div>

        <!-- 列表 -->
        <ul class="mt20 list clearfix" id="listData"> </ul>

    </main>

    <div class="fenye">
        <ul id="pageSpan">
            <!--   <li class="active">1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>7</li>
            <li>8</li>
            <li>......</li>
            <span>下一页&gt;</span> -->
        </ul>
    </div>

    <!-- 换页
    <div id="pages" class="rel tcenter mt40">
        <div class="abs pages-box clear-float ">
            <div class="fl">
                <span class="active">1</span>
                <span>2</span>
                <span>3</span>
                <span>4</span>
                <span>5</span>
                <span>6</span>
                <span>7</span>
                <span>8</span>
            </div>
            <div class="fl">......</div>
            <a href=" " class="fl">下一页</ a>
        </div>
    </div> -->





    <footer class="mt20">
        <div class=" footer-box clearfix">
            <dl>
                <dt>联系与支持</dt>
                <dd>400-882-7715</dd>
                <dd>售前咨询</dd>
                <dd>客服&售后</dd>
                <dd>常见问题</dd>
                <dd>极速工单</dd>
                <dd>投诉与建议</dd>

            </dl>
            <dl>
                <dt>联系与支持</dt>
                <dd>400-882-7715</dd>
                <dd>售前咨询</dd>
                <dd>客服&售后</dd>
                <dd>常见问题</dd>
                <dd>极速工单</dd>
                <dd>投诉与建议</dd>
            </dl>
            <dl>
                <dt>联系与支持</dt>
                <dd>400-882-7715</dd>
                <dd>售前咨询</dd>
                <dd>客服&售后</dd>
                <dd>常见问题</dd>
                <dd>极速工单</dd>
                <dd>投诉与建议</dd>
            </dl>
            <dl>
                <dt>联系与支持</dt>
                <dd>400-882-7715</dd>
                <dd>售前咨询</dd>
                <dd>客服&售后</dd>
                <dd>常见问题</dd>
                <dd>极速工单</dd>
                <dd>投诉与建议</dd>
            </dl>
            <dl>
                <dt>联系与支持</dt>
                <dd>400-882-7715</dd>
                <dd>售前咨询</dd>
                <dd>客服&售后</dd>
                <dd>常见问题</dd>
                <dd>极速工单</dd>
                <dd>投诉与建议</dd>
            </dl>
            <div class="footer-erweima">
                <div class="sishijiu">微信公众号</div>
                <div class="ershiqi">源码时代</div>
                <img src="./imgs/wechat-white.png" alt="">
            </div>
        </div>
        <div class="footer-bottom">
            <img src="./imgs/bei2.png" alt="">
            <img src="./imgs/bei1.png" alt="" class="btn2">
            <span class="footer-bottom">
                增值电信业务经营许可证;
                <span>蜀B2-20180596蜀ICP备15006450号-3</span>
                <span>营业执照</span>
            </span>
        </div>
    </footer>
    <script src="./utils/utils.js"></script>
    <script src="./js/plpl.js"></script>
</body>

</html>